<template>
    <div>
        <div class='good'>

            <swiper class='index_lbt'>
                <block>
                    <swiper-item>
                        <img src='/static/images/pet_lbt1.png' />
                    </swiper-item>
                    <swiper-item>
                        <img src='/static/images/pet_lbt2.png' />
                    </swiper-item>
                </block>
            </swiper>

            <div class='good_pet'>

                <div class='good_pet_one' v-for='(good ,index) in goodList' :key='index'>
                    <div class='good_pet_image'>
                        <img :src='good.image'>
                    </div>
                    <div class='good_pet_text'>
                        <span class='pet_name'>{{good.name}}</span>
                        <span class='pet_age'>{{good.age}}</span>
                        <span class='pet_address'>{{good.address}}</span>
                    </div>
                    <div class='good_pet_but'>电话咨询</div>

                </div>

            </div>
        </div>
    </div>
</template>

<script>
import { formatTime } from "@/utils/index";
import card from "@/components/card";

export default {
    components: {
        card
    },

    data() {
        return {
            goodList: [
                {
                    image: "/static/images/index_pet1.png",
                    name: "布偶猫",
                    age: "5个月",
                    address: "遇宠宠物店(建设大道，台北路台北四村)"
                },
                {
                    image: "/static/images/index_pet2.png",
                    name: "加菲猫",
                    age: "5个月",
                    address: "遇宠宠物店(建设大道，台北路台北四村)"
                },
                {
                    image: "/static/images/index_pet3.png",
                    name: "秋田犬",
                    age: "5个月",
                    address: "遇宠宠物店(建设大道，台北路台北四村)"
                },
                {
                    image: "/static/images/index_pet4.png",
                    name: "贵宾犬",
                    age: "5个月",
                    address: "遇宠宠物店(建设大道，台北路台北四村)"
                }
            ]
        };
    },

    created() {
        const logs = wx.getStorageSync("logs") || [];
        this.logs = logs.map(log => formatTime(new Date(log)));
    },
    methods: {}
};
</script>

<style>
/* pages/pets/pets.wxss */

.index_lbt img {
    width: 749rpx;
    height: 320rpx;
}

.good_pet_one {
    width: 684rpx;
    height: 240rpx;
    display: flex;
    margin: 25rpx auto;
    position: relative;
}

.good_pet_image img {
    width: 260rpx;
    height: 240rpx;
}

.good_pet_text {
    display: flex;
    flex-direction: column;
    margin-left: 21rpx;
}

.good_pet_text .pet_name {
    color: #505050;
    font-size: 28rpx;
    margin-top: 33rpx;
    margin-bottom: 5rpx;
}

.good_pet_text .pet_age {
    color: #a6a6a6;
    font-size: 20rpx;
    margin-bottom: 80rpx;
}

.good_pet_text .pet_address {
    color: #a6a6a6;
    font-size: 20rpx;
}

.good_pet_but {
    position: absolute;
    right: 20rpx;
    top: 70rpx;
    width: 116rpx;
    height: 47rpx;
    color: #fff;
    background-color: #ff8d1a;
    font-size: 24rpx;
    text-align: center;
    line-height: 47rpx;
}
</style>
